<template>
  <div
    class="loading position-fixed top-0 start-0 d-flex justify-content-center align-items-center">
    <i class="bi bi-alexa"></i>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue'
</script>

<style lang="scss" scoped>
.loading {
  height: 100vh;
  width: 100vw;
  background-color: #fff;
  z-index: 999999;
  i {
    font-size: 50px;
    color: var(--main-color);
    opacity: 0.5;
    animation: rotate 1s linear infinite;
  }
  @keyframes rotate {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
}
</style>
